<template>
	<view class="roomdetail">
		<!-- 轮播图 -->
		<view class="uni-margin-wrap">
			<swiper class="swiper" circular indicator-active-color="#ffffff">
				<swiper-item v-for="(item,index) in bannerList" :key="index">
					<image style="width: 100%; height: 100%;" :src="item.url">
					</image>
				</swiper-item>
			</swiper>
		</view>
		<!-- 详情 -->
		<view class="detail">
			<view class="detailitem">
				<view class="left">
					房间类别
				</view>
				<view class="right">
					{{roomList.jdfxName}}
				</view>
			</view>
			<view class="detailitem">
				<view class="left">
					房间号
				</view>
				<view class="right">
					{{fjNumber}}
				</view>
			</view>
			<view class="detailitem">
				<view class="left">
					价格
				</view>
				<view class="right">
					{{roomList.fjPrice}}
				</view>
			</view>
			<view class="detailitem">
				<view class="left">
					入住人姓名
				</view>
				<view class="right">
					{{roomList.ruzhuren}}
				</view>
			</view>
			<view class="detailitem">
				<view class="left">
					入住人电话
				</view>
				<view class="right">
					{{roomList.userPhone}}
				</view>
			</view>
			<view class="detailitem">
				<view class="left">
					入住时间
				</view>
				<view class="right">
					{{roomList.enterTime}}
				</view>
			</view>
			<view class="detailitem">
				<view class="left">
					退房时间
				</view>
				<view class="right">
					{{roomList.leaveTime}}
				</view>
			</view>
			<view class="detailitem">
				<view class="left">
					付款方式
				</view>
				<view class="right">
					{{roomList.gmPt}}
				</view>
			</view>
			<view class="detailitem">
				<view class="left">
					来源平台
				</view>
				<view class="right">
					{{roomList.gmPt}}
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		getRoomDetail
	} from '@/api/index.js'
	export default {
		data() {
			return {
				// 房间详情
				roomList: [],
				fjNumber:'',
				bannerList: [{
						url: 'https://img2.baidu.com/it/u=1470740384,2140539142&fm=253&fmt=auto&app=120&f=JPEG?w=1280&h=800'
					},
					{
						url: 'https://img0.baidu.com/it/u=1839135015,723795615&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=500'
					},
					{
						url: 'https://img2.baidu.com/it/u=1470740384,2140539142&fm=253&fmt=auto&app=120&f=JPEG?w=1280&h=800'
					},
					{
						url: 'https://img0.baidu.com/it/u=1839135015,723795615&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=500'
					}

				]
			};
		},
		onLoad(option) {
			this.fjNumber = option.fjNumber
			getRoomDetail({
				id: option.id
			}).then(res => {
				this.roomList = res.data
				console.log('res.data', this.roomList)
			})
		},
		methods: {}
	}
</script>

<style lang="scss">
	.roomdetail {
		background: linear-gradient(#FFE1BB, #FFF6EC);
		height: 100vh;
		width: 100vw;

		//轮播图
		.uni-margin-wrap {
			.swiper {
				height: 340rpx;
			}
		}

		// 详情
		.detail {
			width: 100%;
			height: 850rpx;
			padding: 100rpx 50rpx;
			font-size: 34rpx;

			.detailitem {
				display: flex;
				margin-bottom: 35rpx;

				.left {
					width: 300rpx;
					color: #A0937E;
				}

				.right {
					color: #000000;
					width: 400rpx;
				}
			}
		}
	}
</style>